import { useEffect } from 'react'
import ReactDOM from 'react-dom'

const modalRoot: any = document.getElementById('modal-root');

const Modal = (props: any) => {
    const el = document.createElement('div');
    useEffect(() => {
        modalRoot.appendChild(el);
        return () => {
            modalRoot.removeChild(el);
        }
    })

    return ReactDOM.createPortal(
        props.children,
        el,
    );
}

export default Modal